
/* COMMON STYLE
--------------------------------------------------------- */
body {
	background: #fff;
	color: #404040;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;	
}
* {margin:0; padding:0; outline:none;}
/* Normal links ---*/
a { text-decoration:none }

a:hover, a:active, a:focus { text-decoration:underline; }

/* Content spacing ---*/
p, pre, blockquote,
h1, h2, h3, h4, h5, h6,
ol, ul, dl { margin: 0 0 10px 0; padding: 0; }
h1, h2, h3, h4, h5, h6, p {
font-weight: normal;
margin: 0;
padding: 0;
}
p { line-height:18px; }

img, fieldset{border:0}

.hidden{display:none;}

/* Headings & Titles ---*/
h1 { font-size: 2em; }
h2 { font-size: 2em; color:#717171; }
h3 { font-size: 1.5em; color:#717171; font-weight: normal; margin: 10px 0px;}
h4 { font-size: 1em; color:#717171; }
h5 { font-size: 1em; color:#717171; }

h1, h2, h3, h4, h5 { line-height: 1.2; }
.f_left{float:left;}
.f_left img{}
.f_right{float:right;}
.width_100{
    width:100%;
}
.margin_20{
    margin:20px 0px;
}
.width_100 h3{ 
color: #0767c1;  
font-size: 19px;  
padding: 5;  
font-weight: bold;
border-bottom: #dbe28e 1px dotted;
margin: 20px 0px;
}
/* Small text ---*/
small, .small, .small-text, a.readon { font-size: 0.912em; }

/* List ---*/
ul li {
	margin-bottom: 5px;
	list-style:none;
}

/* Others ---*/
hr {
	border-bottom: 0;
	border-left: 0;
	border-right: 0;
	border-top: 1px solid;
	height: 1px;
}

/* FORM
--------------------------------------------------------- */
input, select, textarea, .inputbox {
	border: 1px solid #e2e9ef;
	border-top-color: #aaa;
	font-family: Arial, sans-serif;
	padding: 4px;
	font-size: 100%;
}
	
input[type="radio"] { border: none; }
	
input[type="checkbox"] { border: none; }

fieldset { border: none; margin: 0; padding: 0; }

legend { font-size: 1.2em; font-weight: bolder; line-height: 1.2; }

/* Tables ---*/
th { font-weight: bold; padding: 5px; text-align: left; }

td { font-size: 100%; padding: 5px; }

/* MAIN LAYOUT DIVS
--------------------------------------------------------- */
/* MAIN COLUMN
--------------------------------------------------------- */
.main { width: 1000px; margin: 0 auto; padding: 0; position: relative; }

/* HEADLINE
--------------------------------------------------------- */
#tophead { background: #000; min-height: 21px; }
#tophead .main { overflow: hidden; }

/* hotline */
.hotline { float: left; font-size: 0.912em; color:#fff; }
.hotline ul { margin-bottom: 0; }
.hotline li { display:block; float: left; margin: 0; font-weight: bold; text-shadow: 0 1px 0 #444; }
.hotline li:first-child { padding: 3px 40px 0 0; } 
.hotline li:first-child span { font-size: 0.83em; } 
.hotline .phone-number { background: url(../images/ico-tel.png) 0 2px no-repeat; padding: 1px 0 0 22px; font-size: 1.25em; }

/* HEADER
--------------------------------------------------------- */
#header { background: url(../images/bghea.png) 0 0 repeat-x #075094;}
#header .main{ overflow: hidden; padding-top: 0px; }
#header .main-inner{ width: 100%; overflow: hidden; margin-bottom: 5px; }
#header  .maque {
     width: 100%;
     color: #fff;
     overflow: hidden;  
     background:#0767c1; 
     border-radius: 7px 7px 0 0;
     -moz-border-radius: 7px 7px 0 0;
     -webkit-border-radius: 7px 7px 0 0;
     height: 20px;
     -webkit-box-shadow:rgba(0,0,0,.50) 10px 10px 10px 10px;
	   -moz-box-shadow:rgba(0,0,0,.50) 10px 10px 10px 10px;
	        
     box-shadow: rgba(0, 0, 0, .50) 10px 10px 10px 10px;
     border: 1px solid rgba(255, 255, 255, .50);
     padding-top: 5px;
}

.tabs-header-inner{ margin:0 auto;}/*21.7*/
.gr-tabs{ height:27px; width:1218px;zoom:1; margin:auto;}/*21.7*/
.gr-tabs p{font-size:12px; line-height:22px; text-align:right; /*float:right;*/ float:left; position:relative; /*right:370px;*/}/*21.7*/
.gr-tabs a, .gr-tabs span{ display:inline-block; color:#999;}/*21.7*/
.gr-tabs a:hover{color:#000;}/*21.7*/
.gr-tabs span{ padding:0 11px;}
.gr-tabs a:hover{/* text-decoration:underline;*/}/*21.7*/
.tabs-header-inner ul{ float:left; left:2px;/*top:24px; */position:relative;clear:both; margin-top: 7px;}/*21.7*/
.tabs-header-inner li{ float:left; /*padding:0 4px;*/ margin-left:-1px;}/*21.7*/
.tabs-header-inner li a{ float:left; width:113px; height:45px; background-image:url(../images/bg-tab-header.png); background-repeat:no-repeat; background-position:0 0;/* width:122px; height:39px; background:url(http://www.mjgroup.com.vn/tp-ho-chi-minh/images_v4/tab-header.png) repeat-x; border:1px solid #b6b6b6;
border-radius:4px 4px 0 0; -moz-border-radius:4px 4px 0 0; -webkit-border-radius:4px 4px 0 0;*/ display:inline-block;}/*21.7*/
.tabs-header-inner li a.active,.tabs-header-inner li a:hover{ background-position:0 -50px; height:62px;/* background:#fff; border-bottom-width:0; height:40px;*/}/*21.7*/
.tabs-header-inner li a i{ display:block; margin:auto; background-image:url(../images/gr-logo.png); background-repeat:no-repeat; height:39px;margin-top:4px}
.nhommua:hover i,.nhommua.active i{ background-position:0 -135px; }
.zap:hover i,.zap.active i{ background-position:0 -180px; }
.hungry:hover i,.hungry.active i{ background-position:0 -225px; }
.kay:hover i,.kay.active i{ background-position:0 -323px; }

.nhommua i{ background-position:0 0;width:92px;}
.zap i{ background-position:0 -45px;width:57px;}
.hungry i{ background-position:0 -90px;width:85px;}
.kay i{ background-position:0 -272px; width:49px;}




.nav-2 { clear: both; }
.nav-2 h4 { display:block; float:left; color: yellow; padding: 13px 20px 0 15px; }

/**/
#nav-menu {
  float: left;
  margin-left: 37px;
  margin-top: 275px;
}
#nav-menu ul {		
list-style: none;
margin: 0;
padding: 0;
z-index: 100;
	cursor: pointer;
-moz-border-radius-bottomright: 7px;
border-bottom-right-radius: 7px;		
-moz-border-radius-bottomleft: 7px;
border-bottom-left-radius: 7px;
background:#074c8d;
}
#nav-menu li {
    font-family: Cantarell,"Droid Sans",Verdana,sans-serif;
    margin-left: 20px;
    margin-right: 10px;
}

#nav-menu a:hover {
 
 }
#nav-menu a {
	display: block;
	text-decoration: none;
	padding: 10px;
	color: #fff;
}
.home {padding: 0px;}
#nav-menu li a.top {
	font: 13px Arial;
	padding: 0px 32px 0px 32px;
	line-height: 45px;
	margin: 0px 1px 0px 0px;
	display: block;
	text-shadow: 1px 1px #000000;
}
#nav-menu li:hover a.top {
	color: #FFFFFF;
}

#nav-menu li.selected:hover > a {
	clear: both;
}
#nav-menu li.selected > a.top, #nav-menu li:hover > a.top {
	color: #FFFFFF;
}

#nav-menu li {
	float: left;
	list-style: none;
}
#nav-menu li:hover {
-moz-border-radius-topright: 7px;
border-top-right-radius: 7px;
-moz-border-radius-topleft: 7px;
border-top-left-radius: 7px;
background: #074c8d;
}




#nav-menu li ul {
	position: absolute;
}
#nav-menu li li {
	clear: both;
}
#nav-menu li ul a {
	height: 20px;
	width: 120px;
	line-height: 20px;
	padding-left: 10px;
	vertical-align: middle;
}
#nav-menu li ul ul {
	margin: -30px 0 0 160px;
}
#nav-menu li li a:hover {
	background: #0767c1;
}
#nav-menu ul li ul {
	padding-bottom: 10px;
}
#nav-menu ul li:hover > ul {
	display: block;
}
#nav-menu ul li ul {
display: none;
padding-bottom: 10px;
}

/* Delivery Process */
.delivery-process { float: right;}
.delivery-process ul { margin: 0; }
.delivery-process li { display: block; text-transform: uppercase; color: #fff; font-weight: bold; margin: 0 12px 0 0; }
.delivery-process ul {
float: right;
margin-top: 14px;
}
.delivery-process li {
float: left;
padding: 0 4px;
width: 157px;
height: 39px;

}
.delivery-process li a {
float: left;
}
/* icons */
.icon { background: url(../images/icon.png) 0 0 no-repeat; }
.returns-exchanges { background-position: 0 0; }
.free-shipping { background-position: 0 -41px; }
.cash { background-position: 0 -86px; }

/* Logo Image ---*/
.logo { margin:0 20px 0 0; float:left; }
.logo  a { background: url(../images/logo_thedienthoai.png) 0 0 no-repeat; display: block; height: 65px; overflow:hidden; text-indent: -999em; width: 253px; }
.logo2 { margin:0 20px 0 0; float:left; }
.logo2  a { background: url(../images/logo_pacific.png) 0 0 no-repeat; display: block; height: 75px; overflow:hidden; text-indent: -999em; width: 163px; }

/* NAVIGATION
--------------------------------------------------------- */
/* Main Nav ---*/
.nav { float: right; font-size: 0.912em; padding-top: 3px;  text-shadow: 0 1px 0 #444;}
.nav ul { float:left; margin:0; }
.nav li { display: block; float:left; padding: 0 0 0 6px; margin: 0 0 0 5px; background: url(../images/bg-line-2.gif) 0 50% no-repeat; }
.nav li:first-child { background: none; }
.nav li a { color:#fff;  } 

.welcome { font-weight: bold; color:#fff; display:block; float:left; margin: 0 20px 0 0; line-height: normal; }

/* CONTAINER
--------------------------------------------------------- */
#container{ width: 100%; background: white url(../images/bg_top_banner.jpg) no-repeat top center;}
#container h2 { border-bottom: 4px solid #c7c7c7; padding: 0 0 5px 42px; margin-bottom: 30px; background: url(../images/icon.png) 0 -138px no-repeat; }

/* cards */
.phone-cards{
    width: 99%; 
    overflow: hidden; 
    margin: 10px 0px 30px 0px; 
    -webkit-border-radius:5px;	
  	border:1px solid #e0e0e0;         
    border-bottom-color:#ccc; 
    -moz-border-radius:5px;
	border-radius:5px;
	-webkit-box-shadow:rgba(0,0,0,.30) 0 2px 3px;
	-moz-box-shadow:rgba(0,0,0,.30) 0 2px 3px;
	box-shadow:rgba(0,0,0,.30) 0 2px 3px;
background:#fff;
}
.phone-cards h7{
    margin: 15px 0px;
    float: left;
}

.card-type { width:155px; float:left; border-right: 1px #CCC solid; margin: 54px 15px 0px 15px;}
.card-type h3 { color:#9a9a9a; font-weight: normal; margin-bottom: 5px; }
.phone-cards.last, .game-cards.last { margin-bottom: 0; border-bottom: 0; }

.cards-content { width: 781px; float:left; overflow:hidden; position:relative; margin-top: 15px;}
.cards-content .btn-prev { display: block; float:left; margin: 0 8px 0 0; padding-top: 45px; width: 18px; }
.cards-content .btn-prev a{ width: 18px; height: 70px; overflow:hidden; display: block; text-indent: -999em; background: url(../images/arrow.gif) 0 -70px no-repeat; }
.cards-content .btn-next { display: block; float:right; margin: 0; padding-top: 45px; width: 18px; }
.cards-content .btn-next a{ width: 18px; height: 70px; overflow:hidden; display: block; text-indent: -999em; background: url(../images/arrow.gif) 0 0 no-repeat; }
.list-cards { width: 727px; float:left; position: relative; overflow:hidden; }
.list-cards ul { margin:0; width: 50000px; } 
.list-cards li { width: 162px; padding: 0 9px 0 10px; border-right: 1px dotted #939393; min-height: 215px; float: left;  }
.list-cards li:first-child {  }
.list-cards li .img a{ background: url(../images/bg-shadow.png) 50% 100% no-repeat; padding-bottom: 11px; display: block; }
.list-cards li img { border: 1px solid #d4d4d4; }
.price { text-align: center; font-size: 17px; color: #333; font-weight: bold; }
.btn-order { width: 114px; background: url(../images/nap_ngay.png) 0 0 no-repeat; padding: 6px 10px 9px 20px; margin:0 auto; display: block; color:#fff; font-size: 1.16em; font-weight: bold; border:none; cursor: pointer; text-align: left; }
*+html .btn-order { height: 40px; visibility:hidden}
.btn-order:hover, .btn-order:focus { text-decoration: none; }

/* payment online */
.payment-online { margin-bottom: 30px; }
.list-banks { overflow: hidden; }
.list-banks .btn-prev { display: block; float:left; width: 12px; margin: 12px 10px 0 0; }
.list-banks .btn-prev a { width: 100%; height: 36px; display:block; overflow:hidden; text-indent:-999em; background: url(../images/arrow.gif) 0 -153px no-repeat; }
.list-banks .btn-next { display: block; float:right; width: 12px; margin: 12px 0 0 0; }
.list-banks .btn-next a { width: 100%; height: 36px; display:block; overflow:hidden; text-indent:-999em; background: url(../images/arrow.gif) 0 -189px no-repeat; }
.bank-logos { width:876px; height:60px; float:left; overflow:hidden; position:relative; }
.bank-logos ul { margin: 0; }
.bank-logos li { display: block; float:left; padding: 0 1px; width: 144px; margin: 0; }
/* FOOTER
--------------------------------------------------------- */
.bg-footer {
width: 100%;
background-color: #121212;
font-size: 13px;
color: #666;
line-height: 20px;
}
.footer{
display: block;
margin: 0;
padding: 0;
}
.logos {
height: 59px;
width: 100%;
background: url(../images/bg-footer.png) repeat-x scroll 0 0 transparent;
overflow: hidden;
}
.bg-footer .container {
padding: 29px 0 15px 0;
overflow: hidden;
}
.container {
width: 987px;
margin: 0 auto;
position: relative;
}
.bg-footer .col-l {
width: 210px;
float: left;
}
.bg-footer .col-l a {
color: #666;
}
.bg-footer .col-l p {
text-align: right;
clear: both;
}
.bg-footer .col-r {
float: right;
margin-top: -9px;
}
.bg-footer .col-r li {
float: left;
max-width: 475px;
}
.bg-footer .col-r li p{
float: left;
min-width: 150px;}

.bg-footer .col-r h3 {
text-transform: uppercase;
font-size: 13px;
font-weight: 700;
color: white;
line-height: 28px;
border-bottom: 1px solid #333;
margin-bottom: 12px;
}
.bg-footer .col-r li a, .bg-footer .col-r li span {
display: block;
line-height: 20px;
color: #666;
}
.bg-footer .col-r li .viewmore {
position: relative;
display: inline-block;
}
.bg-footer .col-r li .viewmore i {
position: absolute;
right: -20px;
top: 0;
display: none;
}
.bg-footer .col-r li a, .bg-footer .col-r li span {
display: block;
line-height: 20px;
color: #666;
}
.footer-share {
width: 250px;
position: relative;
left: -10px;
top: 6px;
}
.footer-share .facebook {
background-position: 0 0;
}
.footer-share .zing {
background-position: -280px 0;
}
.footer-share .yume {
background-position: -320px 0;
}
.footer-share .twitter {
background-position: -40px 0;
}
.footer-share .pin {
background-position: -360px 0;
}
.footer-share .google {
background-position: -240px 0;
}
.footer-share a {
float: left;
display: inline-block;
height: 29px;
width: 29px;
background-image: url(../images/share.png);
background-repeat: no-repeat;
margin: 0 6px;
}

#header {
  height: auto;
}
#container #tophead .main {
  padding: 0;
}

.box.cusbox .box-content {
  background: none repeat scroll 0 0 #FFFFFF;
  border: 1px solid #DBDEE1;
  border-radius: 0 0 7px 7px;
  box-shadow: 2px 5px 4px -3px #DDDDDD;
  padding: 10px;
}

.box.cusbox .box-heading {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background: none repeat scroll 0 0 transparent;
  border-color: -moz-use-text-color -moz-use-text-color #DDDDDD;
  border-image: none;
  border-radius: 7px 7px 0 0;
  border-style: none none dotted;
  border-width: medium medium 1px;
  color: #0767C1;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 20px;
  font-weight: bold;
  line-height: 14px;
  margin-bottom: 12px;
  padding: 8px 10px 7px;
}

#content .cusbox:first-child {
    margin-top: 10px;
}

.cusbox .box-product > div {
  width: auto;
}
.cusbox .box-product {
  width: auto;
}

.catimg {
  border-right: 1px solid steelblue;
  float: left;
  margin-right: 12px;
}

.catbacs {
    float: right;
    cursor: pointer;
}

.product-grid > div{
    width: auto;
}
